<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用bootstrap绘制form表单</title>
<!-- Bootstrap core CSS -->
<link
	href="${pageContext.servletContext.contextPath}/static/plugins/bootstrap-3.3.7-dist/css/bootstrap.min.css"
	rel="stylesheet">
<link
	href="${pageContext.servletContext.contextPath}/static/plugins/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css"
	rel="stylesheet">
<!-- bootstrap-datepicker-1.9.0-dist -->
<link
	href="${pageContext.servletContext.contextPath}/static/plugins/bootstrap-datepicker-1.9.0-dist/css/bootstrap-datepicker.min.css"
	rel="stylesheet">

<!-- Bootstrap core JavaScript-->
<!-- Placed at the end of the document so the pages load faster -->
<!--import jquery before bootstrap javascript-->
<script
	src="${pageContext.servletContext.contextPath}/static/plugins/jquery-1.12.4/jquery-1.12.4.min.js"></script>
<script
	src="${pageContext.servletContext.contextPath}/static/plugins/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!-- bootstrap-datepicker-1.9.0-dist -->
<script
	src="${pageContext.servletContext.contextPath}/static/plugins/bootstrap-datepicker-1.9.0-dist/js/bootstrap-datepicker.min.js"></script>

<script
	src="${pageContext.servletContext.contextPath}/static/plugins/bootstrap-datepicker-1.9.0-dist/locales/bootstrap-datepicker.zh-CN.min.js"></script>
<!-- My97DatePicker -->
<script
	src="${pageContext.servletContext.contextPath}/static/plugins/My97DatePicker/WdatePicker.js"></script>



<script type="text/javascript">
	// 给日期输入框添加事件处理
	$(function() {
		$("#txtCreateDate1").datepicker({
			format : "yyyy-mm-dd",
			language : "fr",
			todayBtn : true
		});
	});
	
	// 删除按钮点击触发的事件:用于发送删除请求
	function deleteMe(userId){
		// 使用确认框，确认用户是否需要进行删除操作
		var r=confirm("您确认删除该记录么?")
		  if (r==true){
			// 使用get方式发送请求
			window.location.href = "UserInfoDeletingControl?uid=" + userId;
		    }
		
	}
</script>

<style>
#maindiv {
	width: 80%;
	padding-top: 10px;
	/* margin: 0px, auto; */
	padding-left: 50px;
}
</style>
</head>
<body>
	<div id="maindiv">
		<div>
			<form class="form-horizontal"
				action="${pageContext.servletContext.contextPath}/UserInfoQueryingControl"
				method="post">
				<div class="form-group">
					<label class="col-sm-2 control-label">用户名</label>
					<div class="col-sm-4">
						<input type="text" class="form-control" id="txtUserName"
							name="user_name" placeholder="请输入用户名">
					</div>

					<label class="col-sm-2 control-label">创建日期</label>
					<div class="col-sm-4">
						<input type="text" class="form-control" id="txtCreateDate"
							name="user_createtime" onClick="WdatePicker()" placeholder="开始日期">

						<input type="text" class="form-control" id="txtCreateDate1"
							name="user_createtime2" placeholder="结束日期">
					</div>
				</div>

				<div class="form-group">
					<div class="col-sm-offset-2 col-sm-2">
						<button type="submit" class="btn btn-default">查询</button>
					</div>
					<div class="col-sm-offset-4 col-sm-2">
						<button type="reset" class="btn btn-default">重置</button>
					</div>
				</div>
			</form>
		</div>

		<!-- 显示查询结果部分-->
		<div class="row">

			<table class="table table-hover">
				<thead>
					<tr>
						<th>序号</th>
						<th>用户名</th>
						<th>创建日期</th>
						<th>修改</th>
						<th>删除</th>
					</tr>
				</thead>
				<tbody>
					<!-- foreach标签的 items属性绑定的是被遍历的集合对象；
           var 属性中存储的是每次从items里面取出的值；
           varStatus保存了foreach标签遍历是的各种属性特征值：例如当前遍历的值是结果集items中的第几个，奇数个；偶数个；遍历的总数 -->
					<c:forEach items="${sessionScope.lstQueryUserInfos}" var="eachBean"
						varStatus="st">
						<tr>
							<th scope="row">${st.index+1}</th>
							<td>${eachBean.user_name}</td>
							<td>${eachBean.user_createtime}</td>
							<td><a href="${pageContext.servletContext.contextPath}/UserInfoModifyJumpControl?uid=${eachBean.user_id}">修改</a></td>
							<td><button type="button" class="btn btn-default"
									onclick="deleteMe(${eachBean.user_id})">删除</button></td>
						</tr>
					</c:forEach>
				</tbody>
			</table>
		</div>
	</div>
</body>
</html>